<!-- 主页拓扑图 -->
<template>
  <div class="main">
    <div class="item" v-for="(value, key, index) in data" :key="index" :style="value.style"
      @click="OpenPage(value.url)">
      <b-model :name="value.name" :iconUil="value.image" :width="value.width+'px'" :style="value.style"
        :fontTransform="value.fontTransform" :textStyle="value.textStyle" :mat="value.mat" :bracket="value.bracket">
      </b-model>
    </div>
  </div>
</template>

<script>
  let topoData = require('../../static/topo.json')
  import axios from 'axios'
  import bModel from '../components/bModel';
  export default {
    data() {
      return {
        data: []
      }
    },
    mounted() {
      this.data = topoData.data.activityPrize;
    },
    methods: {
      OpenPage(url) {
        this.$router.push({
          path: url
        });
      }
    },
    components: {
      bModel
    }
  }

</script>

<style lang="scss" scoped>
  .main {
    width: 100%;
    height: calc(100vh - 120px);
    position: relative;
    left: 60%;
    margin-top: 110px;
    transform: translateX(-40%);
  }

</style>
